<template>
	<view class="property">
		<navbar></navbar>
		<textNavbar myprops="我的资产"></textNavbar>
		<view class="property-content">
			<view class="property-content-TOP" v-for="(item, index) in list" :key="index">
				<view class="property-content-TOP-vw">
					<view class="property-content-TOP-top">
						账户余额
						<text>￥{{item.price}}</text>
					</view>
					<view class="property-content-TOP-top">
						累计提现
						<text>￥{{item.extract_price}}</text>
					</view>
				</view>
				<view class="property-content-TOP-ctn">
					累计￥{{item.allprice}}/入账中￥{{item.extractload}}
					<image src="../../../static/提现.png" mode=""  @click="showDialog1(item.isextract)"></image>
				</view>
				<image src="../../../static/透明钱.png" mode=""></image>
			</view>
			<view class="property-content-bottom">
				<view class="property-content-bottom-vw" @click="clickShow">
					<image src="../../../static/货币分析@1x.png" mode=""></image>
					<text>收入分析</text>
				</view>
				<view class="property-content-bottom-vw weight-two" @click="clickHadnler">
					<image src="../../../static/七收入.png" mode=""></image>
					<text>近七日收入情况</text>
				</view>
				<view class="property-content-bottom-vw weight-three" @click="clickmonth">
					<image src="../../../static/月收入.png" mode=""></image>
					<text>月收入情况</text>
				</view>
				<view class="property-content-bottom-vw weight-four" @click="clickproduct">
					<image src="../../../static/分类@1x.png" mode=""></image>
					<text>产品收入情况</text>
				</view>
			</view>
			<view class="property-content-txjl">
				<view class="property-content-txjl-top">提现记录</view>
				<view class="property-content-txjl-con" v-for="i in cashList" :key="i.id">
					<view class="txjl-con-left">
						<text>{{i.extract_price}}元</text>
						<text class="time">{{i.add_time}}</text>
					</view>
					<view v-if="i.statusname == '审核通过'" class="txjl-con-right1">{{i.statusname}}</view>
					<view v-if="i.statusname == '审核驳回'" class="txjl-con-right2">{{i.statusname}}</view>
					<view v-if="i.statusname == '审核中'" class="txjl-con-right3">{{i.statusname}}</view>
				</view>
			</view>
			<van-dialog id="van-dialog" confirm-button-color="#116c94" />
			<van-dialog 
				:show="show"
				use-slot
				confirm-button-text= '我知道了'
				@close="onClose"
				confirm-button-color="#116c94">
				<view class="dialog-view" v-for="(i, index) in analysis" :key="index">
					<view class="dialog-view-top">
						<view>今日解答免费问题数: <text>{{i.anscount}}</text> 个</view>
						<view>今日抢答付费问题数: <text>{{i.anspaycount}}</text> 个</view>
						<view>七日内解答付费问题数: <text>{{i.anscounts}}</text> 个</view>
					</view>
					<view class="dialog-view-bottom">
						<view>昨日收入：<text>{{i.price}}</text> 个</view>
						<view>累计收入: <text>{{i.allprice}}</text> 个</view>
					</view>
				</view>
			</van-dialog>
			<van-popup
			  :show="showday"
			  position="bottom"
				closeable
				round
			  custom-style="height: 48%; background: #EDEDED;"
			  @close="CloseHandler">
				<view class="seven-income">
					最近七日收入情况
					<view class="seven-income-vw" v-for="(pair, index) in timeValuePairs" :key="index">
						<view class="seven-income-content">
							{{ pair.time }}
							<text>￥{{ pair.price }}</text>
						</view>
					</view>
				</view>
			</van-popup>
			<van-popup
			  :show="showmonth"
			  position="bottom"
				closeable
			  custom-style="height: 60%; background: #EDEDED;"
			  @close="Closemonth">
				<view class="seven-income">
					月收入情况
					<view class="seven-income-vw" v-for="item in yearPrice" :key="Object.keys(item)[0]">
						<view class="seven-income-content">
							{{ Object.keys(item)[0] }} <text>￥ {{ item[Object.keys(item)[0]].price }}</text>
						</view>
					</view>
				</view>
			</van-popup>
			<van-popup
			  :show="product"
			  position="bottom"
				closeable
			  custom-style="height: 60%; background: #EDEDED;"
			  @close="Closeproduct">
				<view class="product-income">
					产品收入情况
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑私问.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								私问 <text>￥ {{typePrice.price2}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑考试.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								文书代写 <text>￥ {{typePrice.price6}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑洗钱.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								合同审查 <text>￥ {{typePrice.price5}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑电话.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								计时电话 <text>￥ {{typePrice.price3}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑见面.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								约见律师 <text>￥ {{typePrice.price4}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑制度.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								合伙协议 <text>￥ {{typePrice.price14}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑事务.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								委托律师 <text>￥ {{typePrice.price12}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑户籍.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								户籍调查 <text>￥ {{typePrice.price8}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑民事起诉.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								民事起诉 <text>￥ {{typePrice.price9}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑离婚.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								离婚咨询 <text>￥ {{typePrice.price10}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑仲裁.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								劳动仲裁委托 <text>￥ {{typePrice.price11}}</text>
							</view>
						</view>
					</view>
					<view class="product-income-vw">
						<view class="product-income-vw-view">
							<view class="product-income-vw-view-top">
								<image src="../../../static/黑工伤.png" mode=""></image>
							</view>
							<view class="product-income-vw-view-bottom">
								工伤赔偿 <text>￥ {{typePrice.price13}}</text>
							</view>
						</view>
					</view>
				</view>
			</van-popup>
		</view>
	</view>
</template>

<script>
	import Dialog from '../../../wxcomponents/dist/dialog/dialog';
	import { lawyerPriceDetail, analysis, weekPrice, yearPrice, typePrice, cashList } from '../../../utils/utils';
	export default {
		data() {
			return {
				show: false, // 收入分析
				showday: false, // 近七日收入
				showmonth: false, // 月收入
				product: false, // 产品收入情况
				list: [], // 资金明细数组
				analysis: [], // 收入分析数组
				weekPrice: {}, // 近七日收入分析数组
				yearPrice: [], // 近一年收入分析数组
				typePrice: {}, // 产品收入分析数组
				cashList: [], // 提现记录
			}
		},
		onLoad() {
			// 资金明细
			lawyerPriceDetail((e) => {
				// console.log('资金', e);
				this.list.push(e.data)
				// console.log(this.list);
			})
			// 收入分析
			analysis((res) => {
				// console.log('收入分析', res);
				this.analysis.push(res.data)
			})
			// 近七日收入分析
			weekPrice((a) => {
				// console.log('近七日分析', a);
				this.weekPrice = a.data
				// console.log(this.weekPrice);
			})
			// 近一年收入分析
			yearPrice((b) => {
				// console.log('近一年分析', b);
				this.yearPrice = b.data
				// console.log(this.yearPrice);
			})
			// 产品收入分析
			typePrice((c) => {
				// console.log('产品收入情况', c);
				this.typePrice = c.data
				// console.log(this.typePrice);
			})
			// 提现记录
			cashList((d) => {
				// console.log('提现记录',d);
				this.cashList = [...d.data.data]
				// console.log(this.cashList);
			})
		},
		methods: {
			// 打开收入分析模态框
			clickShow () {
				this.show = true
			},
			// 关闭收入分析模态框
			onClose () {
				this.show = false
			},
			// 去提现
			showDialog1(i) {
				// console.log(i);
				if (i == 0) {
					try {
							Dialog.alert({
							message: '当前非提现时间,请下季度初再试哦,继续去答题吧!',
							confirmButtonText: '我知道了',
						});
						// 在对话框关闭后的逻辑
					} catch (error) {
						// 处理异常情况
					}
				} else {
					// 跳转到提现页面
					uni.navigateTo({
						url:"/pages/Attorney side/tixianPage/tixianPage"
					})
				}
			},
			// 关闭近七日收入分析模态框
			CloseHandler () {
				this.showday = false
			},
			// 打开近七日收入分析模态框
			clickHadnler () {
				this.showday = true
			},
			// 关闭月收入分析模态框
			Closemonth () {
				this.showmonth = false
			},
			// 打开月收入分析模态框
			clickmonth () {
				this.showmonth = true
			},
			// 打开产品收入情况模态框
			Closeproduct () {
				this.product = false
			},
			// 打开产品收入情况模态框
			clickproduct () {
				this.product = true
			},
		},
		computed: {
			timeValuePairs() {
				// 对象变成数组，每个对象对应数据，比如第一个就是time1,price1,等...
				let pairs = [];
				// 遍历数据对象，构建时间戳与价格的配对数组
				for (let key in this.weekPrice) {
					if (key.startsWith('time')) {
						// 获取时间戳的值
						let timeValue = this.weekPrice[key];
						// 构造与之对应的priceKey（假设time与price是按数字顺序对应）
						let priceKey = 'price' + key.slice(-1); // 假设time1对应price1，time2对应price2
						let priceValue = this.weekPrice[priceKey] || '0'; // 如果找不到对应的价格，默认值设为"0"
						pairs.push({ time: timeValue, price: priceValue });
					}
				}
				return pairs;
			},
		}
	}
</script>

<style lang="scss" scoped>
	.property {
		width: 100vw;
		height: 100vh;
	}
	.property-content {
		width: 100%;
		height: 83.5%;
		background-color: #EDEDED;
		display: flex;
		flex-direction: column;
		align-items: center;
		overflow-x: auto;
	}
	.property-content-TOP {
		width: 710rpx;
		height: 220rpx;
		border-radius: 24rpx;
		position: relative;
		background: linear-gradient(0deg, #2B3767 0%, #384B85 100%), linear-gradient(90deg, #FCBE69 0%, #F6C248 100%);
	}
	.property-content-TOP > image {
		width: 180rpx;
		height: 180rpx;
		position: absolute;
		right: -30rpx;
		top: -30rpx;
	}
	.property-content-TOP-vw {
		width: 424rpx;
		height: 80rx;
		margin: 42rpx 0 0 28rpx;
		display: flex;
		justify-content: space-between;
	}
	.property-content-TOP-top {
		width: 96rpx;
		height: 82rpx;
		color: white;
		font-size: 24rpx;
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}
	.property-content-TOP-top > text {
		font-size: 36rpx;
		font-weight: bold;
	}
	.property-content-TOP-ctn {
		width: 650rpx;
		height: 42rpx;
		margin: 36rpx 0 0 28rpx;
		color: rgba(255, 255, 255, 0.6);
		font-size: 24rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.property-content-TOP-ctn > image {
		width: 132rpx;
		height: 42rpx;
	}
		
	.property-content-bottom {
		width: 710rpx;
		height: 160rpx;
		background-color: white;
		border-radius: 16rpx;
		margin-top: 16rpx;
		display: flex;
		justify-content: space-around;
		align-items: center;
	}
	.property-content-bottom-vw {
		width: 96rpx;
		height: 108rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.property-content-bottom-vw > image {
		width: 72rpx;
		height: 72rpx;
	}
	.property-content-bottom-vw > text {
		font-size: 24rpx;
		font-weight: normal;
		color: #383838;
		line-height: 28rpx;
	}
	
	.weight-two {
		width: 168rpx;
	}
	.weight-three {
		width: 120rpx;
	}
	.weight-four {
		width: 144rpx;
	}
	
	.dialog-view {
		height: 400rpx;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: space-around;
	}
	.dialog-view-top {
		display: flex;
		flex-direction: column;
		align-items: center;
	}
	.dialog-view-top > view > text {
		font-weight: bold;
	}
	.dialog-view-bottom > view > text {
		font-weight: bold;
	}
	
	.seven-income {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 40rpx;
		font-size: 28rpx;
		overflow: hidden;
	}
	.seven-income > .seven-income-vw {
		width: 90%;
		height: 80rpx;
		background-color: white;
		border-radius: 16rpx;
		font-weight: bold;
		display: flex;
		margin-top: 10rpx;
	}
	.seven-income-content > text {
		color: red;
		font-weight: normal;
	}
	.seven-income-content {
		width: 90%;
		margin-left: 30rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.product-income {
		display: flex;
		flex-direction: column;
		align-items: center;
		margin-top: 40rpx;
		font-size: 28rpx;
		overflow: hidden;
	}
	.product-income > .product-income-vw {
		width: 90%;
		height: 80rpx;
		background-color: white;
		border-radius: 16rpx;
		font-weight: bold;
		display: flex;
		margin-top: 10rpx;
	}
	.product-income-vw-view {
		display: flex;
		align-items: center;
	}
	.product-income-vw-view-top{
		width: 68rpx;
		height: 68rpx;
		border-radius: 12rpx;
		background: linear-gradient(0deg, #EBEDF0, #EBEDF0), #EFEFEF;
		display: flex;
		justify-content: center;
		align-items: center;
		margin-left: 20rpx;
	}
	.product-income-vw-view-top > image {
		width: 44rpx;
		height: 44rpx;
	}
	.product-income-vw-view-bottom {
		width: 74vw;
		font-size: 28rpx;
		font-weight: bold;
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-left: 10rpx;
	}
	.product-income-vw-view-bottom > text {
		color: red;
		font-weight: normal;
	}

	.property-content-txjl {
		width: 710rpx;
		height: 400px;
		overflow-y: auto;
		margin-top: 10px;
		background-color: white;
		border-radius: 8px;
	}
	.property-content-txjl-top {
		margin: 5px 0 5px 5px;
	}
	.property-content-txjl-con {
		width: 98%;
		height: 40px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		border-bottom: solid 1px #EDEDED;
		margin: 0 auto 5px;
	}
	.txjl-con-left {
		display: flex;
		flex-direction: column;
	}
	.txjl-con-left > .time {
		color: #c7c7c7;
		font-size: 14px;
	}
	.txjl-con-right1 {
		background-color: #6a9564;
		border-radius: 20px;
		padding: 3px 6px;
		color: white;
	}
	.txjl-con-right2 {
		background-color: #e10000;
		border-radius: 20px;
		padding: 3px 6px;
		color: white;
	}
	.txjl-con-right3 {
		background-color: #d4d400;
		border-radius: 20px;
		padding: 3px 6px;
		color: white;
	}
</style>
